Live Preview
Sign Up
📋 Embed Code
Paste this right before your <nav> element — works on any HTML website

🌐 Any website

Works on WordPress, Webflow, Squarespace, Shopify, or plain HTML — just paste the code.

⚡ No dependencies

Pure HTML + CSS + JS, zero libraries. Under 3KB. Loads instantly on every device.

Text
Buttons & Links

📦 My Banners

All your saved banners. Click one to edit, or copy the embed code directly.

📖 How to Use BannerForge

Add a professional banner to any website in under 2 minutes.

1

Design your banner

Go to the Editor tab. Edit the title, subtitle, icon, colors, and buttons in the right panel. See changes live in the preview above.

2

Save it

Click 💾 Save in the top bar. Your banner is stored in My Banners where you can manage multiple banners for different websites.

3

Copy the embed code

The embed code is in the lower section of the Editor. Click 📋 Copy or ⬇ Download .html.

4

Paste on your website

Open your website's HTML and paste the code right after your </nav> tag. That's it.

🌐 Platform-specific tips

WordPress — use a Custom HTML block or add to your theme's header.php after <?php wp_nav_menu() ?>

Webflow — add an Embed element right below your Navbar component

Shopify — paste in theme.liquid after {% section 'header' %}

Squarespace — use Code Injection in Settings → Advanced → Code Injection (header)

Wix — use Add → Embed → Custom Code, set to load in body

💡 Pro tips

• Use the Remember dismissed toggle (Settings tab) so visitors who close the banner don't see it again until you update it.

• Set Sticky on to keep the banner visible as users scroll — great for promotions.

• Create separate banners for different pages — save them all in My Banners.

Ready
Summer Sale 2025
0 saved